<template>
  <el-row :class="'inter-chat'">
    <div class="sub-module-title">面试安排</div>
    <el-row class="info-box">
      <el-col :span="12" class="info-item" v-if="chatData.DDInfo.interviewName">
        <span class="info-item-tip">
          面试官
        </span>
        ：
        <span class="info-item-txt">
          {{ chatData.DDInfo.interviewName }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item">
        <span class="info-item-tip">
          面试时间
        </span>
        ：
        <span class="info-item-txt" >
           {{ chatData.DDInfo.interTime }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item">
        <span class="info-item-tip">
          联系电话
        </span>
        ：
        <span class="info-item-txt">
          {{ chatData.DDInfo.interviewPhone }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item itme-time" v-if="chatData.DDInfo.interTime1">
        <span class="info-item-tip">
          面试时间
        </span>
        
        <span class="info-item-txt" >
          {{ chatData.DDInfo.interTime1 }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item">
        <span class="info-item-tip">
          面试形式
        </span>
        ：
        <span class="info-item-txt">
          {{ chatData.DDInfo.format }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item itme-time" v-if="chatData.DDInfo.interTime2">
        <span class="info-item-tip">
          面试时间
        </span>
        
        <span class="info-item-txt">
         {{ chatData.DDInfo.interTime2 }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item">
        <span class="info-item-tip">
          面试地点
        </span>
        ：
        <span class="info-item-txt">
           {{ chatData.DDInfo.addr }}
        </span>
      </el-col>
      <el-col :span="12" class="info-item">
        <span class="info-item-tip">
          备注
        </span>
        ：
        <span class="info-item-txt">
          {{ chatData.DDInfo.desc }}
        </span>
      </el-col>
    </el-row>
    <div :class="'supplier-box'" >
      <span class="title">供应商确认</span>
      <el-row :class="'supplier-main'">
        <el-col :span="12">
          <span class="main-item" >
            <span>面试时间：</span>
            <span>{{ chatData.GYInfo.interTime }}</span>
          </span>

        </el-col>
        <el-col :span="12">
          <span class="main-item" >
            <span>备注：</span>
            <span>{{ chatData.GYInfo.desc }}</span>
          </span>
        </el-col>
      </el-row>
    </div>

  </el-row>
</template>
<script>
export default {
  props: {
    chatData: {
      type: Object,
      default: {}
    },
    isSHowChat: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {}
  },
  mounted() {
    console.log('==============aaa=');
    console.log(this.chatData);
  }
}
</script>
<style lang="scss">
/* .inter-chat {
  padding-left: 20px;
  padding-right: 20px;
  background-color: #fff;
  margin-bottom: 20px;
  height: auto;
  overflow: hidden;
  .infos {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding-bottom: 50px;
    .info-item {
      position: relative;
      width: 100%;
      height: auto;
      overflow: hidden;
      margin-top: 50px;
      .radius-pic {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        text-align: center;
        line-height: 60px;
        display: block;
        font-size: 18px;
        font-weight: bold;
        margin-top: 12px;
      }
    }
    .arrow-icon {
      font-size: 18px;
      position: absolute;
      top: 30px;
    }
    .info-detail-box {
      width: 500px;
      padding-top: 15px;
      padding-bottom: 15px;
      padding-right: 15px;
      border-radius: 4px;

      .detail-item {
        display: block;
        font-size: 14px;
        height: auto;
        overflow: hidden;
      }
      .detail-tip {
        color: #79783d;
        width: 80px;
        height: 100%;
        overflow: hidden;
        line-height: 20px;
        text-align: left;
        display: inline-block;
        float: left;
      }
      .sign-icon {
        width: 10px;
        float: left;
        display: block;
        text-align: left;
      }
      .detail-txt {
        line-height: 20px;
        color: #3b3b3b;
        max-width: 360px;
        float: left;
      }
    }
    .left-info {
      .radius-pic {
        margin-right: 10px;
        background-color: #aec785;
        color: #fff;
        float: left;
      }
      .arrow-icon {
        left: 79px;
        color: #f3fae8;
      }
      .info-detail-box {
        float: left;
        background-color: #f3fae8;
        padding-left: 24px;
        border: 1px solid #e5f7c8;
        margin-left: 20px;
        .detail-time {
          color: #aec785;
          font-size: 14px;
        }
      }
    }
    .right-info {
      .radius-pic {
        margin-left: 10px;
        background-color: #fcf8c3;
        color: #fff;

        float: right;
      }
      .arrow-icon {
        right: 79px;
        color: #fcf8e3;
      }
      .info-detail-box {
        background-color: #fcf8e3;
        padding-left: 24px;
        border: 1px solid #faebcc;
        float: right;
        margin-right: 20px;
        .detail-time {
          color: #f5cd9f;
          font-size: 14px;
        }
      }
    }
  }
} */

.inter-chat {
  padding-left: 20px;
  padding-right: 20px;
  background-color: #fff;
  margin-bottom: 20px;
  height: auto;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  .info-box {
    width: 100%;
    padding-bottom: 20px;
    padding-top: 20px;
    .info-item {
      // width: 100%;
      display: inline-block;
      text-align: left;
      font-size: 14px;
      color: #636363;
    }
    .itme-time{
      .info-item-tip{
        visibility: hidden;
      }
      .info-item-txt{
        padding-left: 18px;
      }
    }
    .info-item-tip {
      display: inline-block;
      width: 90px;
      height: 40px;
      line-height: 40px;
      text-indent: 5px;
    }
  }
}

.supplier-box {
  padding-bottom: 20px;
  .title {
    border-left: 4px solid #fa8919;
    padding-left: 10px;
    margin-left: 4px;
    color: #fa8919;
    width: 98%;
    text-align: left;
    display: inline-block;
    font-size: 14px;
  }
  .supplier-main {
    margin-top: 15px;
    border: 1px solid #fcecd2;
    background-color: #fdf8f0;
    padding: 20px;
    .el-col .main-item {
      margin-top: 5px;
      display: inline-block;
      width: 100%;
      span{
        float: left;
        color: #3a3a3a;
        font-size: 14px;
      }
    }
  }
}
</style>
